<template>
	<transition name="fade">
  <div class="box">
      <div class="box">
            <div class="content">
            	   <ul>
            	<li><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1544410949382&di=8b725d7bc67e6b0b04302b709bb8af42&imgtype=0&src=http%3A%2F%2Fimg.pconline.com.cn%2Fimages%2Fupload%2Fupc%2Ftx%2Fitbbs%2F1310%2F17%2Fc2%2F27591207_1381944138747_mthumb.jpg"/>
            	<div class="content-wrapper">
            		<p>夫妻档打造成都最地道民宿</p>
            		<div class="iconf">
            				<span id="">2018-10-20
            		</span>
            		<div class="iconfont icon-ban">
            			<span id="">1000
            		</span>
            		<span class="iconfont icon-xiaoxi1">900</span>
            		</div>
            		</div>
            	</div>
            	</li>
            	<li><img src="http://img.zcool.cn/community/011da959d3af8fa801204463524303.jpg@1280w_1l_2o_100sh.jpg"/>
            	<div class="content-wrapper">
            		<p>厦门彭于晏日式小清新民宿</p>
            		<div class="iconf">
            			<span id="">2018-10-20
            		</span>
            		<div class="">
            			<span class="iconfont icon-ban">1600
            		</span>
            		<span class="iconfont icon-xiaoxi1">1090</span>
            		</div>
            		</div>
            	</div>
            	</li>
            	<li><img src="http://www.mn520.cc/uploadfile/2017/1225/20171225114847700.jpg"/>
            	<div class="content-wrapper">
            		<p>把爱丽丝仙境搬到民宿里</p>
            		<div class="iconf">
            			<span id="">2018-10-20
            		</span>
            		<div class="iconfont icon-ban">
            			<span id="">800
            		</span>
            		<span class="iconfont icon-xiaoxi1">200</span>
            		</div>
            		</div>
            	</div>
            	</li>
            	<li><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1544356240863&di=d8bab9fc1993919bc41339217b2733de&imgtype=0&src=http%3A%2F%2Fimgsrc.baidu.com%2Fimgad%2Fpic%2Fitem%2F810a19d8bc3eb1359b3f7996ad1ea8d3fd1f4427.jpg"/>
            	<div class="content-wrapper">
            		<p>武汉版中国合伙人打造温馨小窝</p>
            		<div class="iconf">
            			<span id="">2018-11-20
            		</span>
            		<div>
            			<span class="iconfont icon-ban">1200
            		</span>
            		<span class="iconfont icon-xiaoxi1">1000
            		</span>
            		</div>
            		</div>
            	</div>
            	</li>
            </ul>
            </div>
        </div>
    </div>
  </transition>
</template>
<script>
</script>

<style lang="scss" scoped>
@import '@/lib/reset.scss';
.content{
	ul{
			width:100%;
			@include flexbox;
      @include flex-direction(column);
		li{
			padding-top:20px;
			@include rect(100%,2.2rem);
			@include flexbox;
      @include flex-direction(column);
			justify-content:center;
			@include align-items();
			border-bottom:1px solid #cecece;
			img{
				@include rect(90%,1.3rem)
			}
			.content-wrapper{
			@include rect(90%,0.7rem);
			@include flexbox;
			@include flex-direction(column);
			 justify-content:center;
			.iconf{
				@include rect(100%,0.3rem);
			  @include flexbox;
			  justify-content:space-between;
			  @include align-items();
			}
			}
		}
	}
	
}
</style>